<template>
  <view class="alter-address-container">
    <form @submit.prevent="submitForm">
      <view class="form-item">
        <text class="label">收货人</text>
        <input v-model="form.name" placeholder="请输入收货人姓名" />
      </view>
      <view class="form-item">
        <text class="label">手机号</text>
        <input v-model="form.tel" placeholder="请输入手机号" />
      </view>
      <view class="form-item">
        <text class="label">省</text>
        <input v-model="form.province" placeholder="请输入省份" />
      </view>
      <view class="form-item">
        <text class="label">市</text>
        <input v-model="form.city" placeholder="请输入城市" />
      </view>
      <view class="form-item">
        <text class="label">区/县</text>
        <input v-model="form.county" placeholder="请输入区/县" />
      </view>
      <view class="form-item">
        <text class="label">详细地址</text>
        <input v-model="form.addressDetail" placeholder="请输入详细地址" />
      </view>
      <view class="form-item">
        <text class="label">邮政编码</text>
        <input v-model="form.postalCode" placeholder="请输入邮政编码" />
      </view>
      <view class="form-item">
        <text class="label">省市区编码</text>
        <input v-model="form.areaCode" placeholder="如140000-140700-140724" />
      </view>
      <view class="form-item switch-item">
        <text class="label">设为默认地址</text>
        <switch :checked="form.isDefault" @change="e => form.isDefault = e.detail.value" />
      </view>
      <button class="submit-btn" form-type="submit">保存修改</button>
    </form>
  </view>
</template>

<script setup lang="ts">
import { ref, onMounted } from 'vue'
import { onLoad } from '@dcloudio/uni-app'
import { request, BASE_URL } from '@/Requset/request'

const form = ref({
  name: '',
  tel: '',
  province: '',
  city: '',
  county: '',
  areaCode: '',
  postalCode: '',
  addressDetail: '',
  isDefault: false
})
const address_id = ref('')

// 页面加载时获取地址详情并回显
onLoad(async (options) => {
  console.log('onLoad options:', options)
  address_id.value = options.id
  console.log('编辑页收到的id:', address_id.value)
  if (!address_id.value) {
    uni.showToast({ title: '地址ID缺失', icon: 'none' })
    setTimeout(() => uni.navigateBack(), 1000)
    return
  }
  const token = uni.getStorageSync('token')
  // 正确的接口和参数
  const res = await request({
    url: BASE_URL + 'api/getoneaddress/',
    method: 'GET',
    data: { address_id: address_id.value },
    header: { token }
  })
  console.log('接口返回:', res)
  let data = res.data && res.data.message ? res.data.message : res.data
  console.log('解析后的data:', data)
  if (data) {
    form.value = {
      name: data.name || '',
      tel: data.tel || data.phone || '',
      province: data.province || '',
      city: data.city || '',
      county: data.county || data.district || '',
      areaCode: data.areaCode || '',
      postalCode: data.postalCode || '',
      addressDetail: data.addressDetail || data.detail || '',
      isDefault: !!data.isDefault
    }
    console.log('赋值后的form:', form.value)
  } else {
    console.warn('未获取到有效的地址数据')
  }
})

// 提交表单
async function submitForm() {
  const token = uni.getStorageSync('token')
  if (!form.value.name || !form.value.tel || !form.value.province || !form.value.city || !form.value.county || !form.value.addressDetail) {
    uni.showToast({ title: '请填写完整信息', icon: 'none' })
    return
  }
  uni.showLoading({ title: '保存中...' })
  try {
    const res = await request({
      url: BASE_URL + 'api/updateaddress?address_id=' + address_id.value,
      method: 'POST',
      header: {
        token,
        'content-type': 'application/x-www-form-urlencoded'
      },
      data: {
        name: form.value.name,
        tel: form.value.tel,
        province: form.value.province,
        city: form.value.city,
        county: form.value.county,
        areaCode: form.value.areaCode,
        postalCode: form.value.postalCode,
        addressDetail: form.value.addressDetail,
        isDefault: form.value.isDefault
      }
    })
    uni.hideLoading()
    if (res.data && res.data.status === 0) {
      uni.showToast({ title: '修改成功', icon: 'success' })
      setTimeout(() => {
        uni.navigateBack()
      }, 800)
    } else {
      uni.showToast({ title: res.data.message || '修改失败', icon: 'none' })
    }
  } catch (e) {
    uni.hideLoading()
    uni.showToast({ title: '请求失败', icon: 'none' })
  }
}
</script>

<style scoped>
.alter-address-container {
  padding: 24rpx;
  background: #f7f7f7;
  min-height: 100vh;
}
.form-item {
  margin-bottom: 32rpx;
  background: #fff;
  border-radius: 12rpx;
  padding: 20rpx 24rpx;
  display: flex;
  align-items: center;
}
.label {
  width: 160rpx;
  color: #333;
  font-size: 28rpx;
}
input {
  flex: 1;
  border: none;
  background: transparent;
  font-size: 28rpx;
  color: #222;
  outline: none;
}
.switch-item {
  justify-content: space-between;
}
.submit-btn {
  width: 100%;
  height: 88rpx;
  background: #1989fa;
  color: #fff;
  border: none;
  border-radius: 44rpx;
  font-size: 32rpx;
  margin-top: 32rpx;
}
</style>